/**
 * 企业级徽章组件
 * 用于状态标识、数字提示等
 */
export default function Badge({
  children,
  variant = 'default',
  size = 'md',
  dot = false,
  pulse = false,
  className = ''
}) {
  
  const variants = {
    default: 'bg-white/10 text-gray-300 border-white/20',
    primary: 'bg-gradient-to-r from-accent-purple/20 to-accent-blue/20 text-accent-purple border-accent-purple/30',
    success: 'bg-green-500/20 text-green-400 border-green-500/30',
    warning: 'bg-yellow-500/20 text-yellow-400 border-yellow-500/30',
    danger: 'bg-red-500/20 text-red-400 border-red-500/30',
    info: 'bg-blue-500/20 text-blue-400 border-blue-500/30',
  }
  
  const sizes = {
    sm: 'px-1.5 py-0.5 text-xs',
    md: 'px-2 py-1 text-xs',
    lg: 'px-3 py-1.5 text-sm',
  }
  
  if (dot) {
    const dotColors = {
      default: 'bg-gray-400',
      primary: 'bg-accent-purple',
      success: 'bg-green-500',
      warning: 'bg-yellow-500',
      danger: 'bg-red-500',
      info: 'bg-blue-500',
    }
    
    return (
      <span className={`inline-flex items-center ${className}`}>
        <span className={`w-2 h-2 rounded-full ${dotColors[variant]} ${pulse ? 'animate-pulse' : ''}`} />
        {children && <span className="ml-1.5 text-sm text-gray-300">{children}</span>}
      </span>
    )
  }
  
  return (
    <span
      className={`
        inline-flex items-center font-semibold rounded-full border
        ${variants[variant]}
        ${sizes[size]}
        ${pulse ? 'animate-pulse' : ''}
        ${className}
      `}
    >
      {children}
    </span>
  )
}

